/********************flexbox********************/
.flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.flex-row { flex-direction: row; }
.flex-col { flex-direction: column; }
.flex-row-reverse { flex-direction: row-reverse; }
.flex-col-reverse { flex-direction: column-reverse; }
.flex-center { justify-content: center; align-items: center; }
.justify-center { justify-content: center; }
.justify-end { justify-content: flex-end; }
.justify-between { justify-content: space-between; }
.justify-around { justify-content: space-around; }
.align-center { align-items: center; }
.align-end { align-items: flex-end; }
.align-stretch { align-items: stretch; }
.flex-grow { flex: 1 0; }

/********************primary********************/
.white { color: #ffffff; }
.white-bg { background: #ffffff; }
.full-width { width: 100%; }
.full-height { height: 100%; }
.hidden { display: none; }
.block { display: block; }
.inline-block { display: inline-block; }
.relative { position: relative; }
.absolute { position: absolute; }
.fixed { position: fixed; }
.left { float: left; }
.right { float: right; }
.overflow-hide { overflow: hidden; }
.border-box { box-sizing: border-box; }
.pointer { cursor: pointer; }
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.nowrap { white-space: nowrap; }
.break-word { word-break: break-all; }
.lh-10 { line-height: 1.0; }
.lh-12 { line-height: 1.2; }
.lh-15 { line-height: 1.5; }
.lh-20 { line-height: 2.0; }
.lines-1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.lines-2 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
